import { ref, reactive } from 'vue';
import { updatepassword, logout } from '~/api/manager';
import { showModal, toast } from '~/composables/util';
import { useRouter } from 'vue-router';
import { useStore } from 'vuex';
import { refAutoReset } from '@vueuse/core';
export function useRepassword() {
  //获取组件实例 通过ref.value可以使用组件暴露出来的方法
  const router = useRouter();
  const store = useStore();
  const formDrawerRef = ref(null);
  const form = reactive({
    oldpassword: '',
    password: '',
    repassword: '',
  });
  const rules = {
    oldpassword: [
      {
        required: true,
        message: '旧密码不能为空',
        trigger: 'blur',
      },
    ],
    password: [
      {
        required: true,
        message: '新密码不能为空',
        trigger: 'blur',
      },
    ],
    repassword: [
      {
        required: true,
        message: '确认密码不能为空',
        trigger: 'blur',
      },
    ],
  };
  const formRef = ref(false);
  const onSubmit = () => {
    formRef.value.validate((valid) => {
      if (!valid) {
        return false;
      }
      formDrawerRef.value.showLoading();
      updatepassword(form)
        .then((res) => {
          toast('修改密码成功，请重新登录');
          store.dispatch('logout');
          router.push('/login');
        })
        .finally(() => {
          formDrawerRef.value.hideLoading();
        });
    });
  };
  const openRePasswordForm = () => formDrawerRef.value.open();
  return {
    formDrawerRef,
    form,
    rules,
    formRef,
    onSubmit,
    openRePasswordForm,
  };
}

export function useLogout() {
  const router = useRouter();
  const store = useStore();
  function handleLogout() {
    showModal('是否要退出登录？').then((res) => {
      logout().finally(() => {
        store.dispatch('logout');
        // 跳转回登录页
        router.push('/login');
        // 提示退出登录成功
        toast('退出登录成功');
      });
    });
  }
  return {
    handleLogout,
  };
}
